<template>
  <div class="wrapper">
    <el-row :gutter="8">
      <el-col :span='5'>
        <img alt="" class="img" :src="img" draggable="false"/>
      </el-col>
      <el-col :span='17'>
        <h5 class="title">{{title}}</h5>
        <p class="content">{{describe}}</p>
      </el-col>
    </el-row>
  </div>
</template>

<script>
export default {
  name: 'PageQuickServicePart',
  props: {
    img: {
      required: true
    },
    title: {
      required: true,
      type: String
    },
    describe: {
      required: true,
      type: String
    }
  }
}
</script>

<style lang="scss" scoped>

  .wrapper{
    text-align: left;
    vertical-align: middle;
    user-select: none;

    .img{
      display: block;
      width: 60px;
      height: 60px;
    }

    .title{
      font-weight: 700;
      font-size: 16px;
      text-transform: capitalize;
      margin-bottom: .5rem;
    }

    .content{
      font-size: 14px;
      font-weight: 400;
      line-height: 26px;
    }

  }

</style>
